<template>
  <div class="justify-center flex course">
    <div class="w-[940px] bg-[#292a2c]">
      <div class="pt-3 pb-10">
        <CourseTitle title="Ai photo retouching course" />
      </div>
      <div class="course-title bg-red-500/20 text-center py-2 mb-10">课程内容展示</div>
      <div class="w-full">
        <div class="course-title">毛发拱起，反翘呆毛（4090下耗时120秒</div>
        <div class="course-image grid grid-cols-2">
          <img src="./img/43.jpg" alt="" />
          <img src="./img/44.jpg" alt="" />
        </div>
        <div class="course-title" style="letter-spacing: 0.2rem; font-size: 1.5rem">
          炸毛优化，毛发走势梳理，质感优化（4090下耗时150秒
        </div>
        <div class="course-image grid grid-cols-2">
          <img src="./img/45.jpg" alt="" />
          <img src="./img/02.jpg" alt="" />
        </div>
        <div class="course-title">表情修改</div>
        <div class="course-image grid grid-cols-2">
          <img src="./img/03.jpg" alt="" />
          <img src="./img/04.jpg" alt="" />
        </div>
        <div class="course-title">动态毛发制作</div>
        <div class="course-image grid grid-cols-2">
          <img src="./img/05.jpg" alt="" />
          <img src="./img/06.jpg" alt="" />
        </div>
        <div class="course-title text-center mt-[10rem] mb-[15rem]">
          <div>篇幅所限</div>
          <div>更多内容课私聊咨询</div>
        </div>
      </div>
      <CourseFoot></CourseFoot>
    </div>
  </div>
</template>

<script setup lang="ts">
import CourseTitle from '@/components/CourseTitle/CourseTitle.vue'
import CourseFoot from '@/components/CourseFoot/CourseFoot.vue'
</script>
